<template>
	<view class="content-box">
		<view class="fixed">
			<view class="content1">
				<Head></Head>
			</view>
			<view class="content2">
				<Banner></Banner>
			</view>
		</view>

		<swiper :indicator-dots="false" :autoplay="true" :interval="3000" :duration="500" class="swiper-box" :style="{'height':swiperHeight+'px'}">

			<swiper-item>
				<view class="swiper-item box1">
					<view style="opacity: 0;">
					            <text><strong>与我们合作</strong><br><br>牛津国际教育集团</text>
					
					          </view>
					<view class="sanjiao">
						<view>
							<image src="../../static/down.png" mode="widthFix" class="down-jiantou">
						</view>
					</view>
				</view>
			</swiper-item>
		</swiper>


<div class="main-center">
      <p style="text-align: center;margin-top: 50px;">欢迎访问</p>
      <h1 style="text-align: center;">与我们合作</h1>
      <div class="details">
        <p>在过去的29年里，牛津国际与5000多个招生机构建立了紧密的合作伙伴关系，为来自100个国家的50多万名学生提供教育机会。我们与像我们一样热衷于为每个学生提供最佳体验的招生代理合作，对我们的工作倍感自豪。</p>
        <p>我们的招生团队遍布世界各地，与区域合作伙伴合作，为学生匹配最适合其学术目标的课程。我们与知名的教育代理和顾问、<!-- 高中和 -->大学海外部门、学校和大学顾问以及负责海外奖学金的政府部门有着密切的工作关系。</p>
        <p>与我们合作，可以保证您的学生将：</p>
        <p>获得激动人心的学习体验；</p>
        <p>获得个性化关注；</p>
        <p>有机会认识来自世界各地的学生。</p>
      </div>
      <!--<div class="fangwen">
        <a href="https://www.oxfordinternational.com/partnering-with-us/agent-application/">与我们合作</a>
      </div>-->
      <div class="details1">
        <p>如您对我们的项目感兴趣，请与我们的招生官取得联系！</p>
        <p ><strong>大学项目</strong></p>
        <div class="zhanshi">
          <div>
            <p>Cecillia SHEN</p>
            <p>中国区高级招生经理（北区）</p>
            <p>CShen@OxfordInternational.com</p>
          </div>
          <div>
            <p>Katherine CAI</p>
            <p>中国区招生经理（南区）</p>
            <p>kcai@OxfordInternational.com</p>
          </div>
          <div>
            <p>Jimmy JING</p>
            <p>中国区高级招生主任（中区）</p>
            <p>jming@OxfordInternational.com</p>
          </div>
        </div>
        <!-- <p  class="ppp"><strong>中学项目</strong></p>
        <div class="zhanshi1">
          <div>
            <p>Lin SHEN</p>
            <p>中国区招生经理</p>
            <p>lshen@OxfordInternational.com</p>
          </div>
        </div> -->
        <p></p>
      </div>
    </div>
<Foot></Foot>
	</view>
</template>

<script>
	import Head from '@/components/head.vue'
	import Banner from '@/components/banner.vue'
	import Foot from '@/components/foot.vue'
	export default {
		components: {
			Head,
			Banner,
			Foot
		},
		data() {
			return {
				swiperHeight: 0,
			};
		},
		onLoad() {
			let H = window.innerHeight
			let W = window.innerWidth
this.swiperHeight = H
			/* if (W > 750) {
				
			} else {
				this.swiperHeight = 500
			} */
		}
	}
</script>

<style lang="scss" scoped>
	@import url("../../css/daxue.css");

	.box1 {
		background: url("../../static/agents/partner-with-us-1.jpg") no-repeat center top;
		// background-size: 100% auto;
		background-size:   auto 100%;
	}
	.main-center {
	    max-width: 1200px;
	    margin: 0 auto;
	  }
		.mid {
		    margin: 40px auto 40px auto;
		    max-width: 1200px;
		    display: flex;
		    flex-direction: row;
		    justify-content: space-between;
		    font-size: 17px;
		    line-height: 36px;
		
		    div {
		      flex: 1;
		      width: 50%;
		      margin: 0 30px;
		      display: flex;
		      flex-direction: column;
		
		      p {
		        span {
		          font-weight: bold;
		        }
		      }
		
		      ul {
		        display: flex;
		        flex-direction: column;
		
		        li {
		          /*margin-bottom: 15px;*/
		
		          span {
		            font-weight: bold;
		          }
		        }
		      }
		    }
		  }
		
		  .fangwen {
		    text-align: center;
		    margin: 50px auto 80px auto;
		
		    a {
		      padding: 18px 26px;
		      background: #303030;
		      color: #fff;
		      text-decoration: none;
		      transition: all 0.3s ease;
		    }
		
		    a:hover {
		      background: #3281c4;
		    }
		  }
		
		
		  .map {
		    padding: 45px 0 90px 0;
		    background: url("../../static/oic/map_bg.jpg") no-repeat center center;
		    background-size: 100% auto;
		  }
		
		  .map > div {
		    max-width: 800px;
		    margin: 0 auto;
		    background: #fff;
		    padding: 30px 25px 30px 30px;
		    display: flex;
		    flex-direction: row;
		
		    div:nth-of-type(1) {
		      margin-right: 20px;
		
		      .biaoji-size {
		        display: block;
		        width: 60px;
		      }
		    }
		
		    div:nth-of-type(2) {
		      display: flex;
		      flex-direction: column;
		      padding-bottom: 70px;
		
		      span {
		        margin-bottom: 15px;
		      }
		    }
		  }
		
		  .details{
		    font-size: 17px;
		    line-height: 36px;
		    color: #303030;
		    padding-bottom: 100px;
				p{
					margin-bottom: 20px;
				}
		    a{
		      text-decoration: none;
		      color: #303030;
		      transition: all .3s;
		    }
		    a:hover{
		      color: #409eff;
		    }
		  }
			ul,li{
				list-style: none;
				padding: 0;
			}
			.ppp{
				margin-top: 100px;
			}
			.details1{
			    text-align: center;
			
			    max-width: 900px;
			    margin: 0 auto;
			    margin-top: -70px;
			    font-size: 18px;
			    line-height: 36px;
			    color: #303030;
			    padding-bottom: 100px;
			
			    p{
			      line-height: 20px;
			      margin-top: 30px;
			    }
			    span{
			      line-height: 40px;
			      display: block;
			      width: 100%;
			      font-size: 14px;
			    }
			
			    a{
			      text-decoration: none;
			      color: #303030;
			    }
			  }
				h1{
					margin: 20px auto;
				}
			.zhanshi{
			    display: flex;
			    flex-direction: row;
			    justify-content: space-between;
			  }
			  .zhanshi1{
			    display: flex;
			    flex-direction: row;
			    justify-content: center;
			  }
			@media screen and (max-width: 750px){
				.ppp{
					margin-top: 30px;
				}
				.zhanshi{
				    display: flex;
				    flex-direction: column;
				    // justify-content: space-between;
						div{
							margin-bottom: 30px;
						}
				  }
				.details{
					font-size: 15px;
					line-height: 30px;
					/* padding-left: 0px;
					flex-direction: column;
					align-items: center; */
					p,ul{
						width: 90%;
						margin: 0 auto;
						margin-bottom: 30px;
					}
					
				}
				.details1{
					font-size: 15px;
					line-height: 30px;
					/* padding-left: 0px;
					flex-direction: column;
					align-items: center; */
					text-align: left;
					p,ul{
						width: 90%;
						margin: 0 auto;
						margin-bottom: 30px;
					}
					
					.zhanshi1{
					  display: flex;
					  flex-direction: row;
					  justify-content: left;
						padding-left: 8px;
					}
				}
			}
</style>
